import React, { Component } from 'react'
import { NavLink } from 'react-router-dom'
import { AppstoreOutline,TextOutline,UserOutline,PayCircleOutline } from 'antd-mobile-icons'

export default class footer extends Component {

    static defaultProps = {
        footerList:[
            {
                name:'美洽',
                aa:'/app/home',
                icon:<AppstoreOutline />
            },
            {
                name:'商城',
                aa:'/app/shop',
                icon:<PayCircleOutline />
            },
            {
                name:'科普',
                aa:'/app/learn',
                icon:<TextOutline />
            },
            {
                name:'我的',
                aa:'/app/my',
                icon:<UserOutline />
            },
        ]
    }
    render() {
        const { footerList } = this.props
        return (
            <div className="footer-box">
                {
                    footerList.length && footerList.map((item,index)=>{
                    return <div key={index}>
                        <NavLink to={item.aa}>
                            <dl>
                                <dt>{item.icon}</dt>
                                <dd>{item.name}</dd>
                            </dl>
                        </NavLink>
                        </div>
                    })
                }
            </div>
        )
    }
}
